<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
		<script>
			$(function(){
				// 1. 向id为ul1的ul下添加一个span(后面)
				//$("#ul1").append("<span>需求1</span>")
				//$("<span>需求1</span>").appendTo("#ul1")
				
				// 2. 向id为ul1的ul下添加一个span(前面)
				//$("#ul1").prepend("<span>需求2</span>")
				//$("<span>需求2</span>").prependTo("#ul1")
				
				// 3. 在id为ul1的ul下的li(title为hello)的前面添加span
				//$("#ul1 li[title=hello]").after("<span>需求3</span>")
				//$("<span>需求3</span>").insertAfter("#ul1 li[title=hello]")
				
				
				// 4. 在id为ul1的ul下的li(title为hello)的后面添加span
				//$("#ul1 li[title=hello]").before("<span>需求4</span>")
				//$("<span>需求4</span>").insertBefore("#ul1 li[title=hello]")
				
				// 5. 移除id为ul2的ul下的li(title为hello)
				//$("#ul2 li[title=hello]").remove()
				
				// 6. 移除id为ul2的ul下的所有li
				//$("#ul2").empty()
				$("#ul2 li").remove()
			})
		</script>
	</head>
	<body>
		<ul id="ul1">
			<li>AAAAA</li>
			
			<li title="hello">BBBBB</li>
			<li class="box">CCCCC</li>
			
			<li title="hello">DDDDD</li>
			<li title="two">EEEEE</li>
			
			<li>FFFFF</li>
		</ul>
		<br />
		<br />
		<ul id="ul2">
			<li>aaa</li>
			
			<li title="hello">bbb</li>
			<li class="box">ccc</li>
			
			<li title="hello">ddd</li>
			<li title="two">eee</li>
		</ul>
	</body>
</html>
